<script setup lang='ts'>
// 组件在 组合式 API 中导入即注册
import BoxCom from "@/components/BoxCom.vue";
import {ref} from 'vue'
import type {Ref} from 'vue'

const msg:Ref<string> = ref('你笑起来真好看')
const name:Ref<string> = ref('张三')

// 1. 定义一个接收子组件传递值的方法
function changeName(msg:string) {
    console.log(msg);
    name.value = msg
}

</script>
<template>
    <div >
        父组件  --- {{msg}} -- {{name}}
        <hr>
        <!-- 2. 监听自定义的事件 -->
        <BoxCom @change-name='changeName' name='张三' :msg='msg' :age='18' />
    </div>
</template>
<style>
    
</style>